<template>
	<view class="pserson-list">
		<view @click="goChat(item.userid, item.userName)" class="person-item" v-for="item in personList" :key="item.userid">
			<image class="person-avator" :src="item.avator" mode=""></image>
			<text class="person-username">{{item.userName}}</text>
		</view>
	</view>
</template>

<script setup>
import { ref } from 'vue';
	const personList = ref([
		{
			userName: '张学友',
			avator: 'https://img0.baidu.com/it/u=781435481,24052815&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1729789200&t=1d6e0402531cbb654a4910645d519904',
			userid: 'zxy'
		},
		{
			userName: '刘德华',
			avator: 'https://img2.baidu.com/it/u=1001860741,127553111&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1729789200&t=655ef53507699175cbfe56fdec93396f',
			userid: 'ldh'
		},
		{
			userName: '郭富城',
			avator: 'https://img2.baidu.com/it/u=627100025,1003920823&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1729789200&t=a7b3e5bcde1d7cf27e5cadcca4168dcc',
			userid: 'gfc'
		},
		{
			userName: '李少斌',
			avator: 'https://img2.baidu.com/it/u=627100025,1003920823&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1729789200&t=a7b3e5bcde1d7cf27e5cadcca4168dcc',
			userid: 'bin'
		}
	])
	const goChat = (userid, username) => {
		console.log(userid)
		uni.navigateTo({
			url:'/pages/chat/chat?userid='+userid + '&username=' + username
		})
	}
</script>

<style lang="scss" scoped>
	.person-item{
		display: flex;
		align-items: center;
		background: #f1f1f1;
		margin-bottom: 20rpx;
		.person-avator{
			width: 100rpx;
			height: 100rpx;
		}
	}
</style>
